<template>
	<view>
		<view class="comment-item">
			<view class="avatar">
				<u-avatar :src="giveAvatar(item)" size="26"></u-avatar>
			</view>

			<view class="wrap" @click="goReply">
				<view class="username">
					{{ giveName(item) }}
					<text v-if="!closeBtn" class="iconfont icon-a-43-guanbi" @click.stop="delComment"></text>
				</view>
				<view class="comment-content">{{ item.comment_content }}</view>
				<view class="info">
					<view class="reply-btn" v-if="!childState">{{item.totalReply || ''}}回复</view>
					<view>
						<uni-dateformat :date="item.comment_date" :threshold="[60000, 3600000 * 24 * 30]"></uni-dateformat>
					</view>
					<view>{{ item.province }}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import { giveName, giveAvatar } from '../../utils/tools.js';
const db = uniCloud.database();
const utilsObj = uniCloud.importObject("utilsObj", {
	customUI: true
});
export default {
	name: 'comment-item',
	data() {
		return {
			
		};
	},
	props: {
		item: {
			type: Object,
			default: () => {}
		},
		childState:{
			type:Boolean,
			default:false
		},
		closeBtn:{
			type:Boolean,
			default:false
		}
	},
	methods: {
		giveName,
		giveAvatar,
		//跳转到回复页面
		goReply(){
			if(this.childState) return; //如果是二级评论，不跳转
			uni.setStorageSync('replyItem',this.item)
			uni.navigateTo({
				url:'/pages_blog/reply/reply'
			})
		},

		//删除评论
		delComment() {
			uni.showModal({
				title: '确认删除',
				success: (res) => {
					this.removeComment();
				}
			});
		},
		// 删除评论
		removeComment() {
			// 鉴权
			let uid = uniCloud.getCurrentUserInfo().uid;
			//当前用户id和文章id相等  或者是管理员
			if (uid === this.item.user_id[0]._id || this.uniIDHasRole('admin') || this.uniIDHasRole('webmaster')) {
				db.collection('quanzi_comment')
					.doc(this.item._id)
					.remove()
					.then((res) => {
						uni.showToast({
							title: '删除成功'
						});
						this.$emit('removeEnv', { id: this.item._id });
						//评论数量-1
						if(this.item.comment_count>0){
						utilsObj.operation('quanzi_article', 'comment_count',this.item.article_id, -1)
							
						}
					});
			}else{
			
			}
		}
	}
};
</script>

<style lang="scss" scoped>
.comment-item {
	display: flex;
	.wrap {
		flex: 1;
		padding-left: 20rpx;
		padding-bottom: 20rpx;

		.username {
			font-size: 26rpx;
			color: #666;
			padding: 10rpx 0;

			display: flex;
			justify-content: space-between;
			align-items: center;
			.iconfont {
				font-size: 20rpx;
				padding: 10rpx;
				color: #999;
			}
		}

		.comment-content {
			font-size: 34rpx;
			color: #111;
			line-height: 1.8em;
		}

		.info {
			font-size: 26rpx;
			color: #666;
			display: flex;
			padding: 10rpx 0;
			align-items: center;

			view {
				margin-right: 25rpx;
			}

			.reply-btn {
				padding: 6rpx 18rpx;
				background: #e4e4e4;
				border-radius: 30rpx;
			}
		}
	}
}
</style>
